<template>
    <div class="content">
        <el-dialog title="新增Mapper" :close-on-click-modal="false" :visible.sync="visible" width="30%">
            <el-form ref="form" :model="form" label-width="auto">
                <el-form-item label="命名空间">
                    <el-input v-model="form.ns" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item label="数据源">
                    <el-input v-model="form.ds" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item label="名称空间">
                    <el-input v-model="form.mns" placeholder="请输入Mapper-Namespace"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button icon="el-icon-circle-plus" @click="handleSumbit">提交</el-button>
                    <el-button icon="el-icon-error" @click="visible = false">取消</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>
<script>
    import { mapperAdd } from '../../api/mapper'
    export default {
        data() {
            return {
                visible: false,
                form: {
                    ns: 'public',
                    ds: '',
                    mns: ''
                }
            }
        },
        methods: {
            init(ns, ds) {
                this.form = {
                    ns: 'public',
                    ds: '',
                    mns: ''
                }
                this.form.ns = ns || 'public'
                this.form.ds = ds
                this.visible = true
            },
            handleSumbit() {
                mapperAdd(this.form).then((res) => {
                    this.$message({
                        message: '新增成功！', type: 'success'
                        , duration: 800, onClose: () => {
                            this.visible = false
                            this.$emit('refreshDataList')
                        }
                    })
                })
            }
        }
    }
</script>
<style scoped>
.content {
    margin: 20px 0px;
    font-size: 1em;
}
.el-form-item {
    margin: 20px 0px;
    font-weight: bold;
    text-align: left;
}
</style>
